Créer sa première application Yii
================================

Pour se faire la main avec Yii, nous allons décrire dans cette section comment créer votre première application avec le framework Yii. Vous allez pour cela utiliser le puissant outil `yiic` qui peut automatiser la création du code pour certaines tâches. Par convention, nous supposons que `YiiRoot` est le répertoire où Yii est installé, et `WebRoot` est la racine Web du serveur.

Lancez `yiic` sur la ligne de commande comme suit :

~~~
% YiiRoot/framework/yiic webapp WebRoot/testdrive
~~~

> Note|Note: Sur Mac OS, Linux ou Unix, il sera peut être nécessaire de
> modifier les permissions sur le fichier `yiic` pour le rendre exécutable.
> Il est aussi possible de lancer l'outil comme suit :
>
> ~~~
> % cd WebRoot/testdrive
> % php YiiRoot/framework/yiic.php webapp WebRoot/testdrive
> ~~~

Cette commande va créer un squelette d'application Yii sous le répertoire
`WebRoot/testdrive`. L'application comporte une structure de répertoire nécessaire à la plupart des applications `Yii`

Sans écrire une seule ligne de code, vous pouvez tester votre première application Yii, en accédant à l'url suivante dans le navigateur :

~~~
http://WebRoot/testdrive/index.php
~~~

Comme vous pouvez le constater, l'application a trois pages: la page d'accueil,
la page de contact et la page de login. La page d'accueil vous montre des informations sur l'application, ainsi que sur l'état de l'utilisateur connecté. La page de contact affiche un formulaire de contact que les utilisateurs peuvent remplir, et la page de login permet aux utilisateurs de s'authentifier avant d'accéder à un contenu privé.
Les copies d'écran suivantes vous montrent plus de détails.


![Page d'accueil](first-app1.png)

![Page Contact](first-app2.png)

![Page de contact avec des erreurs de saisie](first-app3.png)

![Page de contact envoyée avec succès](first-app4.png)

![Page de login](first-app5.png)


Le schéma suivant montre la structure des répertoires de votre application.
Veuillez consulter la page [Conventions](/doc/guide/basics.convention#directory) pour de plus amples informations à propos de cette structure.

~~~
testdrive/
   index.php                 Point d'entrée de l'application.
   assets/                   Contient les fichiers de ressources publiés
   css/                      Contient les fichiers CSS de l'application
   images/                   Contient les images
   themes/                   Contient les différents thèmes de l'application
   protected/                Contient les fichiers protégés de l'application
	  yiic                   L'outil en ligne de commande 'yiic'
	  yiic.bat               L'outil en ligne de commande 'yiic' pour Windows
	  commands/              Contient les commandes personnalisées pour l'outil 'yiic'
		 shell/              Contient les commandes personnalisées pour l'outil 'yiic shell'
	  components/            Contient les composants utilisateur
		 MainMenu.php        Le widget 'MainMenu'
		 Identity.php        La class 'Identity' utilisée pour l'authentification
		 views/              Contient les fichiers 'Vue' des widgets
			mainMenu.php     Le fichier Vue pour le widget 'MainMenu"
	  config/                Contient les fichiers de configuration
		 console.php         Le fichier de configuration pour l'application en ligne de commande
		 main.php            Le fichier de configuration pour l'application Web
	  controllers/           Contient les fichiers des Controlleurs
		 SiteController.php  Le contrôleur par défaut
	  extensions/            Contient les extensions tierces
	  messages/              Contient les messages traduits
	  models/                Contient les fichiers des Modèles
		 LoginForm.php       Le modèle de type Formulaire pour l'action 'Login'
		 ContactForm.php     Le modèle de type Formulaire pour l'action 'Contact'
	  runtime/               Contient les fichiers temporaires générés par l'application
	  views/                 Contient les fichiers Vue des contrôleurs et Layout
		 layouts/            Contient les fichiers Vue des Layout
			main.php         Le 'layout' par défaut pour toutes les vues
		 site/               Contient les fichiers Vue pour le contrôleur 'site'
			contact.php      La vue pour l'action 'Contact'
			index.php        La vue pour l'action 'index'
			login.php        La vue pour l'action 'login'
		 system/             Contient les fichiers pour les vues système
~~~

Connexions aux bases de données
-------------------------------

La plupart des applications web sont gérées par une base de données.
Notre application de test ne fait pas exception. Pour utiliser une base de
données, nous devons auparavant signaler à l'application comment se connecter à la base de données. Pour cela, il faut modifier le fichier de configuration de l'application
`WebRoot/testdrive/protected/config/main.php` comme ceci :

~~~
[php]
return array(
	......
	'components'=>array(
		......
		'db'=>array(
			'connectionString'=>'sqlite:protected/data/source.db',
		),
	),
	......
);
~~~

Dans cet exemple, nous ajoutons une entrée nommée `db` aux `components` (composants), qui indique à l'application de se connecter à la base de données SQLlite
`WebRoot/testdrive/protected/data/source.db` quand cela est nécessaire.

> Note|Note : Pour utiliser les fonctionnalités de base de données de Yii, il
> est nécessaire d'activer l'extension PDO dans PHP, ainsi que les différents drivers
> PDO spécifiques à chaque base de données. Pour votre application de test, vous
> avez besoin que les extensions `php_pdo` et `php_pdo_sqlite` soient activées.

Pour finir, nous devons préparer une base de donnée SQLite. En utilisant les outils d'administration SQLite, vous pouvez créer une table dans la base de données avec le modèle suivant :

~~~
[sql]
CREATE TABLE User (
	id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
	username VARCHAR(128) NOT NULL,
	password VARCHAR(128) NOT NULL,
	email VARCHAR(128) NOT NULL
);
~~~

> Note: Si vous utilisez MySQL, vous devez remplacer `AUTOINCREMENT`
> par `AUTO_INCREMENT` dans le code SQL ci-dessus.

Par souci de simplification, seule une table appelée `User` est créée dans la base. Le fichier de base de données SQLite est sauvé sous le nom

`WebRoot/testdrive/protected/data/source.db`. Notez que le nom de fichier ainsi
que le répertoire qui le contient doivent être accessibles en écriture par l'utilisateur exécutant le serveur web.


Implémentations des opérations CRUD
-----------------------------------

Maintenant, la partie amusante! Vous allez implémenter les opérations CRUD sur la table `User` que vous venez de créer (CRUD signifie Create, Read, Update et Delete, i.e. Création, Lecture, Modification et Suppression). Les opérations CRUD sont le fondement de la manipulation des données et donc nécessaires la plupart du temps.

Plutôt que d'écrire du code qui implémente ces opérations CRUD, vous allez encore vous servir du puissant outil `yiic`, afin de générer automatiquement ce code. Ce processus est aussi connu sous le nom de *scaffolding* (échafaudage). Ouvrez une fenêtre de ligne de commande, et exécutez les commandes suivantes :

~~~
% cd WebRoot/testdrive
% protected/yiic shell
Yii Interactive Tool v1.0
Please type 'help' for help. Type 'exit' to quit.
>> model User
   generate User.php

The 'User' class has been successfully created in the following file:
	D:\wwwroot\testdrive\protected\models\User.php

If you have a 'db' database connection, you can test it now with:
	$model=User::model()->find();
	print_r($model);

>> crud User
   generate UserController.php
   mkdir D:/wwwroot/testdrive/protected/views/user
   generate create.php
   generate update.php
   generate list.php
   generate show.php

Crud 'user' has been successfully created. You may access it via:
http://hostname/path/to/index.php?r=user
~~~

Ci-dessus, c'est la commande `yiic shell` qui est utilisée pour interagir avec votre
application. Au prompt, nous exécutons 2 sous-commandes : `model User`, et `crud User`.
La première génère une classe "Model" pour la table `User`, et la seconde lit ce modèle pour générer le code qui implémente les opérations CRUD.

> Note|Note : Si vous rencontrez des erreurs comme "...could not find driver", alors
> que le script de test des pré-requis signale que PDO et les drivers associés sont
> bien activés, vous pouvez essayer de lancer l'outil `yiic` de la manière suivante :
>
> ~~~
> % php -c path/to/php.ini protected/yiic.php shell
> ~~~
>
où `path/to/php.ini` représente le chemin d'accès au fichier php.ini

Jetons maintenant un œil à notre application qui est à cette URL :

~~~
http://WebRoot/testdrive/index.php?r=user
~~~

Cela va afficher la liste des entrées contenues dans la table `User`. Etant donné que notre table est vide, rien n'apparaîtra pour le moment.

Cliquez sur le lien `New User` sur la page. Si vous n'étiez pas encore connecté, vous allez être redirigé vers la page de login. Après s'être connecté, un formulaire contenant tous les champs permettant la création d'un utilisateur sera affiché.
Complétez le formulaire, et cliquez sur le bouton `Create`. Si une erreur de saisie
s'est glissée dans le formulaire, un message d'erreur sera affiché, vous empêchant alors de sauvegarder l'entrée. En revenant à la liste des utilisateurs, vous devriez alors voir le nouvel utilisateur que vous avez créé.

Répétez ces étapes pour ajouter autant d'utilisateurs que vous voulez. Notez que la liste des utilisateurs sera automatiquement paginée s'il y a de nombreux utilisateurs à afficher sur une seule page.

Si vous vous connectez en tant qu'administrateur en utilisant `admin/admin`, vous pouvez visiter la page d'administration à l'URL suivante :

~~~
http://WebRoot/testdrive/index.php?r=user/admin
~~~

Cette page affiche une jolie table des utilisateurs. Il est possible de cliquer
sur les entêtes de la table afin de la trier selon la colonne correspondante. Et,
de la même manière que la liste précédente, cette table est paginée si le nombre
d'entrées est trop important.

Toutes ces fonctionnalités ont été réalisées sans écrire une seule ligne de code!

![Page d'administration des utilisateurs](first-app6.png)

![Page de création d'un nouvel utilisateur](first-app7.png)



<div class="revision">$Id: quickstart.first-app.txt 1267 2013-11-20 $</div>
